Skip to content

feat(ui): add element:text_input — free-text data-entry element for SDUI pages#2321

Merged
os-zhuang merged 2 commits into
mainfrom
feat/sdui-form-inputs
Jun 25, 2026
Merged

feat(ui): add element:text_input — free-text data-entry element for SDUI pages#2321
os-zhuang merged 2 commits into
mainfrom
feat/sdui-form-inputs

Conversation

@os-zhuang

Copy link
Copy Markdown
Contributor

Why

SDUI pages could display and navigate but not collect input — there was no free-text input element and no input-bound schema, so you couldn't author a data-entry form as a pure SDUI page. The first consumer is a branded onboarding screen for the cloud control plane (collect a workspace name + subdomain, post to a backend endpoint) that today is hand-rolled vanilla HTML; this lets it become a console-rendered SDUI page (design system, dark mode, i18n). The capability is general — any SDUI data-entry form.

This is the spec half. Paired renderer + action bridge land in objectui.

What

Spec (packages/spec/src/ui)

  • ElementTextInputPropsSchemainputType (text/email/number/tel/url/password), label, placeholder, defaultValue, required, disabled, description, targetVariable.
  • Wired into PageComponentType (page.zod.ts) and ComponentPropsMap (component.zod.ts) as element:text_input.
  • One element carries the whole free-text family via inputType, leaving genuinely-distinct inputs (textarea/select/checkbox) free to arrive as their own elements later.
  • liveness/page.json variables note refreshed to cite the new writer + the {{page.<var>}} submit bridge.

Demo (examples/app-showcase)

  • showcase_contact_form — four element:text_inputs write page variables; a Submit element:button runs an api action whose params reference them as {{page.<var>}}, POSTing to the existing public web-to-lead endpoint (/api/v1/forms/contact-us/submit, ADR-0056) to create a showcase_inquiry. The showcase analog of the onboarding screen.
  • Registered in pages/index.ts, objectstack.config.ts, and the app nav.
  • Changeset: @objectstack/spec minor (fixed group).

Verification

  • Spec suite green: 6624 tests / 245 files (incl. new element:text_input schema + ComponentPropsMap cases).
  • definePage parses the demo page against the built spec.
  • Backend boots with the new config/page (config compiles, nav↔pages resolves).
  • Live E2E: console renders the form, typing writes page variables (the page.inquiryEmail-gated hint appears), Submit POSTs the resolved body {name,email,company,message}HTTP 201, showcase_inquiry created.

🤖 Generated with Claude Code

…DUI pages

SDUI pages could display and navigate but not collect free-text input — the
`element:form` props existed but there was no input element and no input-bound
schema. This adds the data-entry half.

Spec: `ElementTextInputPropsSchema` (label, placeholder, `inputType` —
text/email/number/tel/url/password — defaultValue, required, disabled,
description, targetVariable) wired into `PageComponentType` and
`ComponentPropsMap` as `element:text_input`. One element carries the whole
free-text family via `inputType`, leaving genuinely-distinct inputs (textarea,
select, checkbox) free to arrive as their own elements later.

The objectui renderer binds the typed value into a page variable
(`PageVariableSchema.source`); a submit `element:button` reads it back via
`{{page.<var>}}` token interpolation in the console action runtime.

Demo: `showcase_contact_form` — four text inputs write page variables and a
Submit button POSTs them to the public web-to-lead endpoint
(`/api/v1/forms/contact-us/submit`), creating a `showcase_inquiry`. The showcase
analog of a branded cloud onboarding screen, reusing the console design system
instead of hand-rolled HTML.

Liveness note for PageSchema.variables refreshed to cite the new writer + the
submit bridge. Pairs with the objectui renderer/bridge PR.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@vercel

vercel Bot commented Jun 25, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
spec Ready Ready Preview, Comment Jun 25, 2026 8:53am

Request Review

@github-actions github-actions Bot added documentation Improvements or additions to documentation tests protocol:ui tooling size/m labels Jun 25, 2026
@github-actions

Copy link
Copy Markdown
Contributor

📓 Docs Drift Check

This PR changes 1 package(s): @objectstack/spec.

91 hand-written doc(s) reference the affected code and may need an implementation-accuracy re-verification:

  • content/docs/concepts/architecture.mdx (via @objectstack/spec)
  • content/docs/concepts/cloud-artifact-api.mdx (via packages/spec)
  • content/docs/concepts/cluster-semantics.mdx (via @objectstack/spec)
  • content/docs/concepts/design-principles.mdx (via packages/spec)
  • content/docs/concepts/implementation-status.mdx (via @objectstack/spec)
  • content/docs/concepts/index.mdx (via @objectstack/spec)
  • content/docs/concepts/metadata-driven.mdx (via @objectstack/spec)
  • content/docs/concepts/metadata-lifecycle.mdx (via packages/spec)
  • content/docs/concepts/north-star.mdx (via packages/spec)
  • content/docs/concepts/packages.mdx (via @objectstack/spec)
  • content/docs/concepts/setup-app.mdx (via @objectstack/spec)
  • content/docs/concepts/skills.mdx (via @objectstack/spec)
  • content/docs/concepts/webhook-delivery.mdx (via @objectstack/spec)
  • content/docs/getting-started/architecture.mdx (via @objectstack/spec)
  • content/docs/getting-started/cli.mdx (via @objectstack/spec)
  • content/docs/getting-started/core-concepts.mdx (via @objectstack/spec)
  • content/docs/getting-started/examples.mdx (via @objectstack/spec)
  • content/docs/getting-started/quick-start.mdx (via @objectstack/spec)
  • content/docs/guides/adding-a-metadata-type.mdx (via @objectstack/spec)
  • content/docs/guides/ai-capabilities.mdx (via @objectstack/spec)
  • content/docs/guides/airtable-dashboard-analysis.mdx (via @objectstack/spec)
  • content/docs/guides/analytics-datasets.mdx (via @objectstack/spec)
  • content/docs/guides/api-reference.mdx (via @objectstack/spec)
  • content/docs/guides/business-logic.mdx (via @objectstack/spec)
  • content/docs/guides/cheatsheets/backward-compatibility.mdx (via @objectstack/spec)
  • content/docs/guides/cheatsheets/error-catalog.mdx (via @objectstack/spec)
  • content/docs/guides/cheatsheets/field-type-gallery.mdx (via @objectstack/spec)
  • content/docs/guides/cheatsheets/field-validation-rules.mdx (via @objectstack/spec)
  • content/docs/guides/cheatsheets/permissions-matrix.mdx (via @objectstack/spec)
  • content/docs/guides/cheatsheets/protocol-diagram.mdx (via packages/spec)
  • content/docs/guides/cheatsheets/query-cheat-sheet.mdx (via @objectstack/spec)
  • content/docs/guides/cheatsheets/quick-reference.mdx (via @objectstack/spec)
  • content/docs/guides/client-sdk.mdx (via @objectstack/spec)
  • content/docs/guides/common-patterns.mdx (via @objectstack/spec)
  • content/docs/guides/contracts/auth-service.mdx (via packages/spec)
  • content/docs/guides/contracts/cache-service.mdx (via packages/spec)
  • content/docs/guides/contracts/data-engine.mdx (via @objectstack/spec)
  • content/docs/guides/contracts/index.mdx (via @objectstack/spec)
  • content/docs/guides/contracts/metadata-service.mdx (via packages/spec)
  • content/docs/guides/contracts/storage-service.mdx (via packages/spec)
  • content/docs/guides/data-modeling.mdx (via @objectstack/spec)
  • content/docs/guides/deployment-vercel.mdx (via @objectstack/spec)
  • content/docs/guides/driver-configuration.mdx (via @objectstack/spec)
  • content/docs/guides/error-handling-client.mdx (via @objectstack/spec)
  • content/docs/guides/error-handling-server.mdx (via @objectstack/spec)
  • content/docs/guides/external-datasources.mdx (via @objectstack/spec)
  • content/docs/guides/formula.mdx (via @objectstack/spec)
  • content/docs/guides/hook-bodies.mdx (via packages/spec)
  • content/docs/guides/kernel-services.mdx (via @objectstack/spec)
  • content/docs/guides/metadata/dashboard.mdx (via @objectstack/spec)
  • content/docs/guides/metadata/field.mdx (via @objectstack/spec)
  • content/docs/guides/metadata/flow.mdx (via @objectstack/spec)
  • content/docs/guides/metadata/index.mdx (via @objectstack/spec)
  • content/docs/guides/metadata/object.mdx (via @objectstack/spec)
  • content/docs/guides/metadata/validation.mdx (via @objectstack/spec)
  • content/docs/guides/metadata/workflow.mdx (via @objectstack/spec)
  • content/docs/guides/packages.mdx (via @objectstack/spec)
  • content/docs/guides/plugin-development.mdx (via @objectstack/spec)
  • content/docs/guides/plugins.mdx (via @objectstack/spec)
  • content/docs/guides/project-scoping.mdx (via @objectstack/spec)
  • content/docs/guides/public-forms.mdx (via @objectstack/spec)
  • content/docs/guides/runtime-services/email-service.mdx (via packages/spec)
  • content/docs/guides/runtime-services/index.mdx (via packages/spec)
  • content/docs/guides/runtime-services/queue-service.mdx (via packages/spec)
  • content/docs/guides/runtime-services/sharing-service.mdx (via packages/spec)
  • content/docs/guides/runtime-services/storage-service.mdx (via packages/spec)
  • content/docs/guides/security.mdx (via @objectstack/spec)
  • content/docs/guides/seed-data.mdx (via @objectstack/spec)
  • content/docs/guides/skills.mdx (via @objectstack/spec)
  • content/docs/guides/standards.mdx (via @objectstack/spec)
  • content/docs/guides/troubleshooting.mdx (via @objectstack/spec)
  • content/docs/guides/validating-metadata.mdx (via @objectstack/spec)
  • content/docs/protocol/knowledge.mdx (via @objectstack/spec)
  • content/docs/protocol/objectos/config-resolution.mdx (via @objectstack/spec)
  • content/docs/protocol/objectos/i18n-standard.mdx (via @objectstack/spec)
  • content/docs/protocol/objectos/lifecycle.mdx (via @objectstack/spec)
  • content/docs/protocol/objectos/plugin-spec.mdx (via @objectstack/spec)
  • content/docs/protocol/objectos/runtime-capabilities.mdx (via @objectstack/spec)
  • content/docs/protocol/objectql/index.mdx (via packages/spec)
  • content/docs/protocol/objectql/query-syntax.mdx (via @objectstack/spec)
  • content/docs/protocol/objectql/schema.mdx (via @objectstack/spec)
  • content/docs/protocol/objectql/security.mdx (via packages/spec)
  • content/docs/protocol/objectql/state-machine.mdx (via @objectstack/spec)
  • content/docs/protocol/objectui/actions.mdx (via @objectstack/spec)
  • content/docs/protocol/objectui/concept.mdx (via @objectstack/spec)
  • content/docs/protocol/objectui/index.mdx (via @objectstack/spec)
  • content/docs/protocol/objectui/layout-dsl.mdx (via packages/spec)
  • content/docs/protocol/objectui/record-alert.mdx (via @objectstack/spec)
  • content/docs/protocol/objectui/widget-contract.mdx (via @objectstack/spec)
  • content/docs/releases/index.mdx (via @objectstack/spec)
  • content/docs/releases/v9.mdx (via @objectstack/spec)

Advisory only. To re-verify, run the docs-accuracy-audit workflow scoped to these files:
node scripts/docs-audit/affected-docs.mjs origin/main → pass the list as args.docs.

@os-zhuang

Copy link
Copy Markdown
Contributor Author

Paired objectui PR (renderer + page-variable submit bridge): objectstack-ai/objectui#1995

…sSchema

The new public export legitimately adds one entry to the ./ui surface; the
committed snapshot must match (CI: spec public API surface check).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@os-zhuang
os-zhuang merged commit 3afaeed into main Jun 25, 2026
17 checks passed
@os-zhuang
os-zhuang deleted the feat/sdui-form-inputs branch June 25, 2026 09:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation Improvements or additions to documentation protocol:ui size/m tests tooling

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant